<template>
    <div class="applyInfo">
    <Header :show="true">报名信息 </Header>
    <div class="content">
    	<p>已填写信息</p>
   		<ul>
   			<li v-for="item in arrList">
   				<span class="tit">{{item.tit}}:</span>
   				<span class="text">{{item.text}}</span>
   			</li>
   		</ul>
   		<p>{{arrList2.applyState}}</p>
    </div>
 </div>
</template>

<script>
import Header from '../base/Header'
	export default {
		data() {
			return {
				arrList:[],
				arrList2:[]
			}
		},
        components:{
        	Header
        },
        mounted(){
        	var id = this.$route.params.id;
        	this.fetchData(id);
        },
        methods: {
        	fetchData(id) {
        		let _this = this;
        		this.$http.get('static/data/message.data')
        		.then(function(res){
        			_this.arrList = res.data[id].applyInfo;
        			_this.arrList2 = res.data[id];
        			_this.i = id;
        		}).catch(function(err){
        			console.log(err);
        		})
        	}
        }
	}
</script>

<style scoped lang="less">
.applyInfo{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 11;
    background: #f4f4f4;
	.content{
		padding: 50px 10px;
		font-size: 0.28rem;
		background: #f4f4f4;
		p{
			color: #ff6100;
			padding: 0.2rem 0.25rem 0.1rem;
		}
		ul{
			li{
				background: #fff;
				padding: 0.1rem;
				border-bottom: 1px solid #f4f4f4;
				line-height: 0.64rem;
				font-size: 0.26rem;
				.tit{
					font-weight: bold;
					color: #555;
				}
				.text{
					margin-left: 0.1rem;
					color: #777;
				}
			}
		}
	}
}
</style>